<template>
	<view class="goodsList" @click="goodsListHander">
		<view class="goodsList_image">
			<slot name="image"></slot>
		</view>
		<view class="goodslist_info">
			<view class="goodsList_title">
					<slot name="title"></slot>
			</view>
			<view class="goodsList_price">
				￥<slot name="price"></slot>
			</view>
		</view>
	</view>
</template>

<script setup>
const emit=defineEmits(['myclick'])
const goodsListHander=()=>{
	emit("myclick")
}
</script>

<style lang="scss" scoped>
.goodsList{
	width: 100%;
	height: 220rpx;
	margin-bottom: 4rpx;
	background-color: white;
	display: flex;
	align-items: center;
	.goodsList_image{
		width: 200rpx;
		height: 210rpx;
		border-radius: 20rpx;
		overflow: hidden;
	}
	.goodslist_info{
		flex:1;
		height: 210rpx;
		display: flex;
		flex-direction: column;
		.goodsList_title{
			box-sizing: border-box;
			width: 100%;
			height: 165rpx;
			overflow: hidden;
			word-wrap: break-word;
			font-size: 24rpx;
			line-height: 40rpx;
			padding: 0 20rpx;
		}
		.goodsList_price{
			color: red;
			flex: 1;
			padding: 0 20rpx;
			box-sizing: border-box;
			display: flex;
		}
	}
}
</style>